<template>
    <div>
        <crumbs></crumbs>
        <h1>查询所有学生期中考试信息</h1>
        <el-table :data="examData" style="width: 100%;" id="table">
                <el-table-column prop="stu_id" label="学号" width="180"></el-table-column>
                <el-table-column prop="stu_name" label="姓名" width="180"></el-table-column>
                <el-table-column prop="chinese"  label="语文"></el-table-column>
                <el-table-column prop="math"  label="数学"></el-table-column>
                <el-table-column prop="english" label="英语"></el-table-column>
                <el-table-column prop="lizong" label="理综"></el-table-column>
                <el-table-column prop="wenzong" label="文综"></el-table-column>
        </el-table>
        <div style="margin-top:30px">
            <el-pagination background layout="prev, pager, next" :total="number" :pageSize="page" :current-page="currentPageNumber" @current-change="currentChange"></el-pagination>
        </div>
    </div>
</template>

<script>
import {search_midExam_all} from '@/utils/examination.js';
    export default {
        data(){
            return{
                examData:null,
                number:0,//数据的总个数
                page:5,//五条数据一页
                totalData:0,//请求回来的总数据
                currentPageNumber:1//当前页码
            }
        },
        async mounted(){
            let result = await search_midExam_all({
                method:'get',
                url:'/search_mid',
                params:{},
                headerType:''
            });
            console.log(result);
            this.examData = result;
            this.number = result.length;
            this.totalData = result;
            console.log(this.number);
            this.examData = this.totalData.slice(
                (this.currentPageNumber - 1) * this.page,this.currentPageNumber * this.page//(当前页码 - 1) * 五条数据一页，当前页码 * 五条数据一页
            );
        },
        methods:{
            currentChange(value){
                console.log(value);
                this.examData = this.totalData.slice((value - 1) * this.page,value * this.page);
            }
        }
    }
</script>

<style lang="scss" scoped>
h1{
    font-size: 20px;
}
</style>